<template>
	<view class="tabbar">
		<u-tabbar :value="current" @change="change" :fixed="true" :placeholder="true"
			activeColor="#3E271C" :safeAreaInsetBottom="true">
			<u-tabbar-item text="首页">
				<image class="u-page__item__slot-icon" slot="active-icon"
					src="@/static/tabBar/homeActive.png"></image>
				<image class="u-page__item__slot-icon" slot="inactive-icon"
					src="@/static/tabBar/home.png"></image>
			</u-tabbar-item>
			<u-tabbar-item text="取餐点数据">
				<image class="u-page__item__slot-icon" slot="active-icon"
					src="@/static/tabBar/totalActive.png"></image>
				<image class="u-page__item__slot-icon" slot="inactive-icon"
					src="@/static/tabBar/total.png"></image>
			</u-tabbar-item>
			<u-tabbar-item text="我的">
				<image class="u-page__item__slot-icon" slot="active-icon"
					src="@/static/tabBar/myActive.png"></image>
				<image class="u-page__item__slot-icon" slot="inactive-icon"
					src="@/static/tabBar/my.png"></image>
			</u-tabbar-item>
		</u-tabbar>
	</view>
</template>

<script>
	export default {
		name: "my-tabbar",
		props: {
			current: {
				type: Number,
				default: 0
			}
		},
		data() {
			return {
				
			};
		},
		methods: {
			change(name) {
				console.log(name,'name')
				if (name === 1) {
					this.$uniApi.rl('/pages/team/total')
				} else if (name == 2) {
					this.$uniApi.rl('/pages/team/me')
				} else {
					this.$uniApi.rl('/pages/team/home')
				}
				this.$emit('changeTabbar',name)
				// this.current = name
			},
		}
	}
</script>

<style lang="less">
	.tabbar {
		width: 100vw;
		
		.u-page__item__slot-icon {
			width: 50rpx;
			height: 50rpx;
			
			image {
				width: 100%;
				height: 100%;
			}
		}
	}
</style>
